let roll = new Roll({
  class: "item",
  active: 'active'
})
new Vue({
  el:' #app',
  data(){
    return{
      list: [
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/2.png?122305',
          info: '$5 Amazon Gift Card',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/0_2c965087-6503-421a-9ce0-81c9308bb85b.png?122305',
          info: 'Free MPOW H10',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/1121.png?122305',
          info: 'Happy Thanksgiving!',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/1154.png?122305',
          info: '30% OFF COUPON',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/1155.png?122305',
          info: '40% OFF COUPON',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/86465_5caffdd7-8a2c-4c4a-ad5c-11ca2bbc4ec6.png?122305',
          info: 'Free MPOW M10',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/1121.png?122305',
          info: 'Happy Thanksgiving!',
          active: false
        },
        {
          img: 'https://cdn.shopify.com/s/files/1/0249/2891/1420/files/1155.png?122305',
          info: '40% OFF COUPON',
          active: false
        }
      ],
      roll: roll,
      flag: true,
      luckyTimes: 4,
      prize: -1
    }
  },
  methods: {
    getPrize() {
      this.prize = 6
    },
    move(){
      if (!this.flag) return
      this.roll.start()
      this.flag = false;
      this.getPrize()
      setTimeout(() => {
        this.roll.stop(this.prize, ()=>{
          this.flag = true;
          this.luckyTimes--
          console.log(this.prize + '等奖');
        })
      }, 100)
    },
  },
})